<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<html>
<head>
    <title>产品类型列表</title>
    <meta name="decorator" content="default"/>
    <link rel="stylesheet" href="${ctxStatic}/bootstrap-table/bootstrap-table.css">
    <script src="${ctxStatic}/bootstrap-table/bootstrap-table.js"></script>
    <script src="${ctxStatic}/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
    <script src="${ctxStatic}/bootstrap-table/config.js"></script>

</head>
<body>
<ul class="nav nav-tabs">
    <li class="active"><a href="javascript:void(0);">产品类型列表</a></li>
    <shiro:hasPermission name="sys:productType:edit">
        <li><a href="${ctx}/sys/productType/form">产品类型添加</a>
        </li>
    </shiro:hasPermission>
</ul>
<form id="searchForm" action="${ctx}/sys/productType/listAjaxData" method="post" class="breadcrumb form-search">
    <ul class="ul-form">
        <ul class="ul-form">
            <li>
                <div class="input-prepend">
                    <span class="add-on">产品名称</span>
                    <input id="productTypeName" name="productTypeName" type="text" class="input-medium" placeholder="请输入产品名称"/>
                </div>

                <div class="input-prepend">
                    <span class="add-on">类型标签</span>
                    <input name="productTypeValue" type="text" class="input-medium" placeholder="请输入产品简称"/>
                </div>
            </li>
        </ul>
        <ul class="ul-form">
            <li>
                <div class="input-prepend">
                    <span class="add-on">开通状态</span>
                    <select name="status" class="select-medium">
                        <option value="">全&nbsp;&nbsp;&nbsp;&nbsp;部</option>
                        <option value="OPEN">开&nbsp;&nbsp;&nbsp;&nbsp;通</option>
                        <option value="CLOSE">关&nbsp;&nbsp;&nbsp;&nbsp;闭</option>
                    </select>
                </div>
                <button id="search" class="btn btn-small btn-primary" type="button">
                    查询<span class="icon-search icon-white"></span>
                </button>
                <button id="open" class="btn btn-small btn-primary" type="button">
                    开启<span class="icon-eye-open icon-white"></span>
                </button>
                <button id="close" class="btn btn-small btn-primary" type="button">
                    关闭<span class="icon-eye-close icon-white"></span>
                </button>
            </li>
            <li class="btns">
            </li>
            <li class="clearfix"></li>
        </ul>
    </ul>
</form>

<table id="contentTable">
</table>
<script type="text/javascript">
    $(document).ready(function () {
        closeTip();
        $("#contentTable").bootstrapTable(
                $.fn.BTConfigSimple(
                        {
                            url: "${ctx}/sys/productType/listAjaxData",
                            pageList: [25, 50, 100],
                            pageSize: 25,
                            sortName: "productTypeName",
                            userQuery:function(){
                                return $('#searchForm').refreshByForm().query;
                            },
                            columns: [
                                {
                                    field: 'state',
                                    checkbox: true,
                                    align: 'center'
                                },
                                {
                                    title: '名称',
                                    field: 'productTypeName',
                                    align: 'center',
                                    sortable: true
                                },
                                {
                                    title: '简称',
                                    field: 'productTypeValue',
                                    align: 'center',
                                    sortable: true
                                },
                                {
                                    title: '旧类型',
                                    field: 'oldTypeid',
                                    align: 'center'
                                },
                                {
                                    title: '描述',
                                    field: 'description',
                                    align: 'center'
                                },
                                {
                                    title: '地址',
                                    field: 'serviceUrl',
                                    align: 'left'
                                },
                                {
                                    title: '状态',
                                    field: 'status',
                                    align: 'center',
                                    sortable: true,
                                    formatter: function (value, row, index) {
                                        if (value == "OPEN") {
                                            return '<i class="icon icon-eye-open"></i>开通';
                                        } else {
                                            return '<i class="icon icon-eye-close"></i>关闭';
                                        }
                                    }
                                },
                                {
                                    field: 'operate',
                                    title: '操作',
                                    align: 'center',
                                    width: 90,
                                    events: {
                                        'click .remove': function (e, value, row, index) {
                                            confirmx("您确认要删除[" + row.productTypeName + "]类型?",
                                                     function () {
                                                         $.ajax({
                                                                    url: "${ctx}/sys/productType/delete",
                                                                    type: "post",
                                                                    data: {id: row.id},
                                                                    dataType: "json",
                                                                    success: function (data) {
                                                                        if (data.state == true) {
                                                                            showTip(data.message);
                                                                            refresh();
                                                                        } else {
                                                                            alertx(data.message);
                                                                        }
                                                                    },
                                                                    error: function (data, state, error) {
                                                                        alertx(data.responseText, null, '请求错误');
                                                                    }
                                                                });
                                                     });

                                        }
                                    },
                                    formatter: function (value, row, index) {
                                        var array = [];
                                        array.push('<a class="edit" href="${ctx}/sys/productType/form?id='+row.id+'" title="编辑/查看">');
                                        array.push('<i class="icon icon-edit"></i>');
                                        array.push('</a>');
                                        <c:if test="${fns:getUser().admin}">
                                        array.push('  ');
                                        array.push('<a class="remove" href="javascript:void(0)" title="删除">');
                                        array.push('<i class="icon icon-remove"></i>');
                                        array.push('</a>');
                                        </c:if>
                                        return array.join('');
                                    }
                                }
                            ]
                        }));
        $("#search").click(function () {
            refresh();
        });

        $("#open").click(function () {
            var ids = $.map($("#contentTable").bootstrapTable('getSelections'), function (row) {
                return row.id
            });
            if(ids.length<=0){
                alertx("请至少选择一列");
            }else{
                updateStatus(ids,"OPEN");
            }
        });
        $("#close").click(function () {
            var ids = $.map($("#contentTable").bootstrapTable('getSelections'), function (row) {
                return row.id
            });
            if(ids.length<=0){
                alertx("请至少选择一列");
            }else{
                updateStatus(ids,"CLOSE");
            }
        });

        function updateStatus(ids,status){
            $.ajax({
                   url: "${ctx}/sys/productType/updateStatus",
                   type: "post",
                   data: {ids: ids,status:status},
                   dataType: "json",
                   success: function (data) {
                       if (data.state == true) {
                           showTip(data.message);
                           refresh();
                       } else {
                           alertx(data.message);
                       }
                   },
                   error: function (data, state, error) {
                       alertx(data.responseText, null, state+'请求错误');
                   }
               });
        }

        function refresh() {
            $("#contentTable").bootstrapTable(
                    'refresh', $("#searchForm").refreshByForm());
        }
    });

</script>

</body>
</html>